<template>
  <div style="padding: 10px">
    <a-tabs
      style="background: #ffff; height: 100%"
      v-model:activeKey="activeKey"
    >
      <a-tab-pane key="1" tab="招商分析">
        <div style="padding: 10px 10px">
          <a-row
            :gutter="[16,16]"
            style="background: #fff"
          >
            <a-col :span="$store.getters.isMobile ? 24 : 12">
              <ChannelChart/>
            </a-col>
            <a-col :span="$store.getters.isMobile ? 24 : 12">
              <CustomerConvertChart/>
            </a-col>
          </a-row>
        </div>
        <div style="padding: 10px 10px">
          <a-row
            :gutter="[16,16]"
            style="background: #fff"
          >
            <a-col :span="$store.getters.isMobile ? 24 : 12" >
              <AreaChart/>
            </a-col>
            <a-col :span="$store.getters.isMobile ? 24 : 12">
              <ProfessionChart/>
            </a-col>
          </a-row>
        </div>
      </a-tab-pane>
    </a-tabs>

  </div>
</template>

<script>
import {
  defineComponent,
  ref,
  computed,
  watch,
  onMounted,
  reactive,
  nextTick, toRefs,
} from "vue";
import { Chart } from "@antv/g2";
import { Empty } from "ant-design-vue";
import request from "../../../common/utils/request";
import store from "../../../store";
import ChannelChart from "@/views/village/InvestmentAnalysis/modules/ChannelChart.vue";
import AreaChart from "@/views/village/InvestmentAnalysis/modules/AreaChart.vue";
import ProfessionChart from "@/views/village/InvestmentAnalysis/modules/ProfessionChart.vue";
import CustomerConvertChart from "@/views/village/InvestmentAnalysis/modules/CustomerConvertChart.vue";
import IntendedCustomerList from "@/views/village/BusinessManage/modules/IntendedCustomerList.vue";
export default defineComponent({
  name: "InvestmentAnalysis",
  components: {
    IntendedCustomerList,
    Empty,
    ChannelChart,
    AreaChart,
    ProfessionChart,
    CustomerConvertChart,
  },
  setup() {
    const state = reactive({
      activeKey: '1',
    })


    onMounted(() => {

    });

    return {
      ...toRefs(state),
    };
  },
});
</script>

